<template>
<div class="coupon-client-fixed views-container">
    <div class="flex-row flex-justify-b">
        <div class="wlm-form" style="flex-grow: 1;margin-right: 20px;">
            <div class="wlm-form-header">定向发券</div>
            <div class="wlm-form-content table-content">
                <choose-goods ref="chooseGoods" :config="chooseGoodsConfig" :changeEvt="filtersChange"></choose-goods>
                <el-form ref="orther" :disabled="isFormEdit" :model="formFormatData.formData" :rules="formFormatData.rules" size="small" label-width="180px" class="retail-form" label-position="right">
                    <el-form-item label="活动名称">
                        <el-input v-model="formFormatData.formData.voucher_title" placeholder=""></el-input>
                    </el-form-item>
                    <el-form-item label="选择人群">
                        <div class="table-raido-header flex-row">
                            <div class="table-left">人群名称</div>
                            <div class="table-mid">人群定义</div>
                            <div class="table-right">推荐理由</div>
                        </div>
                        <div class="table-raido-body flex-col">
                            <div class="flex-row" style="margin-bottom:10px;">
                                <div class="table-left flex-col flex-justify-c">
                                    <el-radio v-model="formFormatData.formData.voucher_crowd" :label="1">意向客户</el-radio>
                                </div>
                                <div class="table-mid">7天内在浏览指定商品，但是没有支付的客户</div>
                                <div class="table-right">浏览商品没支付，这么高转化潜力的客户，不定向营销一下太可惜了</div>
                            </div>
                            <div class="flex-row" style="margin-bottom:14px;" v-if="formFormatData.formData.voucher_crowd==1">
                                <el-button v-if="formFormatData.formData.goods==''" type="primary" @click="goodsToogle">添加商品</el-button>
                            </div>
                            <div class="flex-row" style="position: relative;" v-if="formFormatData.formData.voucher_crowd==1">
                             <div>
                                <div v-if="formFormatData.formData.goods.length>0">
                                      {{formFormatData.formData.goods[0]['goods_name']}}
                                  </div>
                                <img
                                    v-if="formFormatData.formData.goods.length>0"
                                    class="goods-list-img"
                                    :src="formFormatData.formData.goods[0]['img']"
                                    alt=""
                                  >
                                <div v-if="formFormatData.formData.goods.length>0" class="goods-list-img-delete" @click="deleteTable"><i class="el-icon-close"></i></div>
                             </div>
                            </div>
                        </div>
                        <div class="table-raido-body flex-row">
                            <div class="table-left flex-col flex-justify-c">
                                <el-radio v-model="formFormatData.formData.voucher_crowd" :label="2">流失客户</el-radio>
                            </div>
                            <div class="table-mid">365天内有过支付，且最近90天内没有支付的客户</div>
                            <div class="table-right">一年内买过，最近3个月没买，发张券刺激下，定向挽留即将流失的客户很有必要</div>
                        </div>
                        <div class="table-raido-body">
                            <div class="flex-row">
                                <div class="table-left flex-col flex-justify-c">
                                    <el-radio v-model="formFormatData.formData.voucher_crowd" :label="3">指定用户</el-radio>
                                </div>
                                <div class="table-mid">选择指定用户，一次最多支持选择 200 个用户，超过只取前面 200 个</div>
                                <div class="table-right">发货慢了?货品有点小瑕疵客户有点不满意?各种场景，定向发张券能有效提升满意度</div>
                            </div>
                            <div class="flex-row" style="margin-top:14px;" v-if="formFormatData.formData.voucher_crowd==3">
                                <chooseUser :config="initChooseUser" ref="chooseUser" :changeEvt="userChange"></chooseUser>
                            </div>
                        </div>
                        <!-- <div class="table-raido-body">
                            <div class="flex-row">
                                <div class="table-left flex-col flex-justify-c">
                                    <el-radio v-model="formFormatData.formData.voucher_crowd" :label="6">指定用户标签</el-radio>
                                </div>
                                <div class="table-mid">选择指定用户，一次最多支持选择 200 个用户，超过只取前面 200 个</div>
                                <div class="table-right">发货慢了?货品有点小瑕疵客户有点不满意?各种场景，定向发张券能有效提升满意度</div>
                            </div>
                            <div class="flex-row" style="margin-top:14px;" v-if="formFormatData.formData.voucher_crowd==6">
                                <el-select multiple v-model="formFormatData.formData.voucher_label" placeholder="请选择" @change="voucherLabelChange">
                                    <el-option :disabled="true">
                                        <span style="float: left;color: #8492a6;">标签名</span>
                                        <span style="float: right; color: #8492a6; font-size: 13px">标签人数</span>
                                    </el-option>
                                    <el-option v-for="item in communityData" :key="item.id" :label="item.name" :value="item.id">
                                        <span style="float: left;">{{item.name}}</span>
                                        <span style="float: right; font-size: 13px;margin-right:20px;">{{item.labelNum}}</span>
                                    </el-option>
                                </el-select>
                            </div>
                        </div> -->
                        <div class="table-raido-body flex-col">
                            <div class="flex-row" style="margin-bottom:10px;">
                                <div class="table-left flex-col flex-justify-c">
                                    <el-radio v-model="formFormatData.formData.voucher_crowd" :label="4">指定商品</el-radio>
                                </div>
                                <div class="table-mid">买过指定商品的客户</div>
                                <div class="table-right">给买奶瓶的客户推荐尿不湿优惠券，买手机的客户推荐充电宝优惠券，简直太精准了</div>
                            </div>
                            <div class="flex-row" style="margin-bottom:14px;" v-if="formFormatData.formData.voucher_crowd==4">
                                <el-button v-if="formFormatData.formData.goods==''" type="primary" @click="goodsToogle">添加商品</el-button>
                            </div>
                            <div  v-if="formFormatData.formData.voucher_crowd==4">
                              <div>
                                    <div v-if="formFormatData.formData.goods.length>0">
                                      {{formFormatData.formData.goods[0]['goods_name']}}
                                  </div>
                                      <img
                                        v-if="formFormatData.formData.goods.length>0"
                                        class="goods-list-img"
                                        :src="formFormatData.formData.goods[0]['img']"
                                        alt=""
                                      >
                                      <div style="position: relative;top:-100px;" v-if="formFormatData.formData.goods.length>0" class="goods-list-img-delete" @click="deleteTable"><i class="el-icon-close"></i></div>
                              </div>
                            </div>
                        </div>
                        <div class="table-raido-body flex-col">
                            <div class="flex-row">
                                <div class="table-left flex-col flex-justify-c">
                                    <el-radio v-model="formFormatData.formData.voucher_crowd" :label="5">自定义</el-radio>
                                </div>
                                <div class="table-mid">最近购买时间，累计购物次数，会员卡等多种条件组合</div>
                                <div class="table-right">大促前定向发券，给活跃老客新品体验券，给VIP客户定向优惠券等等，多种条件随意组合</div>
                            </div>
                            <div v-if="formFormatData.formData.voucher_crowd==5" class="flex-row flex-justify-b flex-align-c" style="padding: 10px;background: #f2f2f2;margin-bottom:10px;" v-for="(item, index) in formFormatData.formData.voucher_custom" :key="index">
                                <div>
                                    <el-select v-model="item.type" @change="voucherCustomDataChange($event,index)" placeholder="请选择">
                                        <el-option v-for="_item in voucherCustomData" v-show="!filterVoucherCustomData.includes(_item.value)" :key="_item.value" :label="_item.label" :value="_item.value">
                                        </el-option>
                                    </el-select>

                                    <!-- <el-select multiple v-model="formFormatData.formData.voucher_label" placeholder="请选择" @change="voucherLabelChange">
                                        <el-option :disabled="true">
                                            <span style="float: left;color: #8492a6;">标签名</span>
                                            <span style="float: right; color: #8492a6; font-size: 13px">标签人数</span>
                                        </el-option>
                                        <el-option v-for="item in communityData" :key="item.id" :label="item.name" :value="item.id">
                                            <span style="float: left;">{{item.name}}</span>
                                            <span style="float: right; font-size: 13px;margin-right:20px;">{{item.labelNum}}</span>
                                        </el-option>
                                    </el-select> -->

                                    <el-select
                                        multiple
                                        v-if="item.type=='user_labels'"
                                        v-model="item.value"
                                        placeholder="请选择"
                                        style="margin-left:20px;"
                                    @change="voucherLabelChange">
                                        <el-option v-for="_item in communityData" :key="_item.id" :label="_item.name" :value="`${_item.id}`">
                                        </el-option>
                                    </el-select>
                                    <el-select v-if="item.type=='many_day_buy'" v-model="item.value" placeholder="请选择" style="margin-left:20px;" @change="findVoucherNumber">
                                        <el-option v-for="_item in dayOptions" :key="_item.value" :label="_item.label" :value="_item.value">
                                        </el-option>
                                    </el-select>
                                    <el-select v-if="item.type=='many_day_not_buy'" v-model="item.value" placeholder="请选择" style="margin-left:20px;" @change="findVoucherNumber">
                                        <el-option v-for="_item in dayOptions" :key="_item.value" :label="_item.label" :value="_item.value">
                                        </el-option>
                                    </el-select>
                                    <el-input-number v-if="item.type=='ave_price_egt'" :controls="false" :min="0.01" v-model="item.value" @blur="findVoucherNumber" placeholder="请输入数值" style="margin-left:20px;"></el-input-number>
                                    <el-input-number v-if="item.type=='ave_price_elt'" :controls="false" :min="0.01" v-model="item.value" @blur="findVoucherNumber" placeholder="请输入数值" style="margin-left:20px;"></el-input-number>
                                    <el-select v-if="item.type=='buy_count_egt'" v-model="item.value" placeholder="请选择" @change="findVoucherNumber" style="margin-left:20px;">
                                        <el-option v-for="_item in timesOptions" :key="_item.value" :label="_item.label" :value="_item.value">
                                        </el-option>
                                    </el-select>
                                    <el-select v-if="item.type=='buy_count_elt'" v-model="item.value" @change="findVoucherNumber" placeholder="请选择" style="margin-left:20px;">
                                        <el-option v-for="_item in timesOptions" :key="_item.value" :label="_item.label" :value="_item.value">
                                        </el-option>
                                    </el-select>
                                    <span
                                        v-show="item.type=='many_day_buy'||item.type=='many_day_not_buy'"
                                        style="margin-left:4px;"
                                      >天内</span>
                                                      <span
                                        v-show="item.type=='ave_price_egt'||item.type=='ave_price_elt'"
                                        style="margin-left:4px;"
                                      >元</span>
                                                      <span
                                        v-show="item.type=='buy_count_egt'||item.type=='buy_count_elt'"
                                        style="margin-left:4px;"
                                      >次</span>
                                </div>
                                <div>
                                    <el-button size="mini" circle icon="el-icon-close" @click="deleteDiyList(index)"></el-button>
                                </div>
                            </div>
                            <div class="flex-row" v-if="formFormatData.formData.voucher_crowd==5">
                                <el-button @click="addDiyList" type="text"><i class="el-icon-plus"></i> 添加筛选条件</el-button>
                            </div>
                        </div>
                    </el-form-item>
                    <el-form-item label="优惠券">
                        <el-button type="primary" @click="couponToogle" style="display: block;margin: 12px 0;">添加优惠券</el-button>
                        <choose-coupon ref="chooseCoupon" :config="chooseCouponConfig" :changeEvt="filtersCouponChange"></choose-coupon>

                        <el-table class="coupon-table" v-show="formFormatData.formData.coupon!=''" :data="formFormatData.formData.coupon" style="width: 100%;margin-top:20px;">
                            <el-table-column prop="date" label="优惠券名称">
                                <template slot-scope="scope">
                                    <p>{{scope.row.name}}</p>
                                </template>
                            </el-table-column>
                            <el-table-column prop="date" label="优惠券内容">
                                <template slot-scope="scope">
                                    <couponRender>
                                        <template slot="title" v-if="scope.row.coupon_type">
                                            {{`${scope.row.rule === 0 ? `${coupon_price[`${scope.row.coupon_type}`]['textRule']}${scope.row.rule_min_money}元`:''} ${coupon_price[`${scope.row.coupon_type}`]['textPrev']}`}}
                                        </template>
                                        <template slot="price">
                                            {{scope.row.coupon_type === 40 ? `${scope.row.min} - ${scope.row.max}` : scope.row.coupon_type === 20 ? scope.row.discount : scope.row.reduce_price}}
                                        </template>
                                        <template slot="tail" v-if="scope.row.coupon_type">
                                            {{coupon_price[`${scope.row.coupon_type}`]['textLast']}}
                                        </template>
                                    </couponRender>
                                </template>
                            </el-table-column>
                            <el-table-column prop="date" label="有效期" min-width="100">
                                <template slot-scope="scope">
                                    <p v-if="scope.row.expire_type==10">{{scope.row.start_time | parseTime('{y}-{m}-{d} {h}:{i}:{s}')}} - {{scope.row.end_time | parseTime('{y}-{m}-{d} {h}:{i}:{s}')}}</p>
                                    <p v-if="scope.row.expire_type==20">当日可用</p>
                                    <p v-if="scope.row.expire_type==30">次日起{{scope.row.expire_day}}天可用</p>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" >
                                <template slot-scope="scope">
                                    <div class="operation-group">
                                        <el-button class="wlm-text" type="text" @click="toggleSelection(scope)">删除</el-button>
                                    </div>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-form-item>
                    <el-form-item label="发放人数" v-if="!isFormEdit">
                        <span v-if="!!voucherNumber">发送给:{{voucherNumber}}人</span>
                        <span v-else>暂无匹配人数</span>
                    </el-form-item>
                    <el-form-item label="发放人数" v-if="isFormEdit">
                        <span>{{formFormatData.formData.number}}</span>
                    </el-form-item>
                </el-form>
            </div>
        </div>

        <div class="wlm-form" style="width:300px">
            <div class="wlm-form-header">定向发券预览</div>
            <div class="wlm-form-content table-content">
                <img
            style="width:100%"
            src="@/assets/couponClient/preview.png"
            alt=""
          >
        </div>
            </div>
        </div>
        <div v-cloak class="wlm-fixed-btn flex-row flex-align-c flex-justify-c">
            <el-button v-if="!isFormEdit" size="small" @click="saveForm" type="primary" :loading="loading">立即发券</el-button>
            <router-link tag="span" to="/application/couponClient">
                <el-button size="small">返回</el-button>
            </router-link>
        </div>
    </div>
</template>

<script>
import ChooseFiles from '@/components/ChooseFiles/index'
import ChooseGoods from '@/components/ChooseGoods/index'
import ChooseCoupon from '@/components/ChooseCoupon/index'
import ChooseUser from '@/components/ChooseUser/index'
// import ueditor from '@/components/Ueditor/index'
import {
  voucherDetail,
  voucherAddEdit,
  voucherNumber
} from '@/api/application'
import {
  labelList
} from '@/api/user'
import mixins from '@/mixins/mixins'
export default {
  mixins: [mixins.getters('Form')],
  name: 'CouponClientFixed',
  components: {
    ChooseFiles,
    ChooseGoods,
    ChooseCoupon,
    ChooseUser,
    couponRender: {
      template: '<span><slot name="title"></slot><span class="text-danger"><slot name="price"></slot></span><slot name="tail"></slot></span>'
    }
  },
  watch: {
    'formFormatData.formData.voucher_crowd': {
      handler(newData, oldData) {
        console.log('newData', newData)
        console.log('oldData', oldData)
        if (newData === 2) {
          this.findVoucherNumber()
        } else {
          this.voucherNumber = ''
        }
      },
      immediate: true,
      deep: false
    }
  },
  computed: {
    filterVoucherCustomData() {
      const result = []
      const voucher_custom = this.formFormatData.formData.voucher_custom
      voucher_custom.map(item => {
        result.push(item.type)
      })
      // this.filterVoucherCustomData = result
      return result
    }
  },
  directives: {},
  created() {
    // this.$nextTick(() => {
    //   // this.goodsCouponGrag()//优惠券拖动
    //   memberCoupon().then((response) => {
    //     const {
    //       data: {
    //         data: msgData = []
    //       }
    //     } = response
    //     const result = []
    //     msgData.map(item => {
    //       const { coupon_id, name } = item
    //       result.push({ coupon_id, name })
    //     })
    //     this.couponData = result
    //     console.log(this.couponData)
    //   })
    //   labelList().then((response) => {
    //     const { data: { data: msgData = [] } } = response
    //     this.communityData = msgData.data
    //     console.log(this.communityData)
    //   })
    // })
  },
  data() {
    return {
      loading: false,
      communityData: [],
      voucherNumber: '',
      initChooseUser: {
        closable: true,
        isNotUnique: true,
        initList: []
      },
      coupon_type: {
        10: '满减券',
        20: '折扣券',
        30: '运费券',
        40: '随机券'
      },
      coupon_price: {
        10: {
          textRule: '满',
          textPrev: '减免',
          textLast: '元'
        },
        20: {
          textRule: '满',
          textPrev: '打',
          textLast: '折'
        },
        30: {
          textRule: '满',
          textPrev: '减免',
          textLast: '元'
        },
        40: {
          textRule: '满',
          textPrev: '范围内随机',
          textLast: '元'
        }
      },
      savetype: [],
      voucherCustomData: [{
        value: 'is_member',
        label: '会员'
      }, {
        value: 'user_labels',
        label: '用户标签'
      }, {
        value: 'many_day_buy',
        label: 'N天内有购买'
      }, {
        value: 'many_day_not_buy',
        label: 'N天内无购买'
      }, {
        value: 'ave_price_egt',
        label: '购买商品均价大于等于'
      }, {
        value: 'ave_price_elt',
        label: '购买商品均价小于等于'
      }, {
        value: 'buy_count_egt',
        label: '累计购买次数大于等于'
      }, {
        value: 'buy_count_elt',
        label: '累计购买次数小于等于'
      }],
      dayOptions: [{
        value: '3',
        label: '3天'
      }, {
        value: '7',
        label: '7天'
      }, {
        value: '14',
        label: '14天'
      }, {
        value: '30',
        label: '30天'
      }, {
        value: '90',
        label: '90天'
      }, {
        value: '180',
        label: '180天'
      }, {
        value: '360',
        label: '360天'
      }],
      timesOptions: [{
        value: '1',
        label: '1'
      }, {
        value: '2',
        label: '2'
      }, {
        value: '3',
        label: '3'
      }, {
        value: '4',
        label: '4'
      }, {
        value: '5',
        label: '5'
      }, {
        value: '6',
        label: '6'
      }, {
        value: '7',
        label: '7'
      }, {
        value: '8',
        label: '8'
      }, {
        value: '9',
        label: '9'
      }, {
        value: '10',
        label: '10'
      }],
      newCouponList: [],
      oldCouponList: [],
      dialogUrl: 1,
      couponData: [],
      defaultMsg: '',
      currentRow: [],
      chooseGoodsConfig: {
        type: ['chooseGoods'],
        model: 'normal',
        initList: [],
        unique: true,
        disabled: [{
          label: 'spec_type',
          value: 20
        }]
      },
      chooseCouponConfig: {
        type: ['chooseCoupon'],
        model: 'display',
        get_limit_type: 0,
        disabled: [{
          label: 'status',
          value: 1,
          reverse: true
        },
        {
          label: 'get_limit_type',
          value: 1
        },
        {
          label: 'coupon_type',
          value: 40
        }],
        initList: []
      },
      formFormatData: {
        key: ['orther'],
        api: {
          editForm: {
            api: voucherDetail,
            params: {
              id: ''
            },
            redirect: 'voucher_id'
          },
          submitForm: voucherAddEdit
        },
        formData: {
          voucher_crowd: 1,
          voucher_custom: [],
          voucher_title: '',
          voucher_type: '3',
          goods: [],
          coupon: [],
          voucher_label: [],
          voucher_user: [],
          number: ''
        },
        rules: {}
      }
    }
  },
  mounted() {

  },
  methods: {
    voucherCustomDataChange(type, index) {
      if (type === 'is_member') {
        this.findVoucherNumber()
      }
      if (type === 'user_labels') {
        this.findlabels()
      }
      this.formFormatData.formData.voucher_custom[index]['value'] = ''
      console.log('7777777777', type)
    },
    findVoucherNumber() {
      const { voucher_crowd, goods, voucher_custom, voucher_user, voucher_label } = this.formFormatData.formData
      const params = { voucher_crowd }
      // console.log("voucher_crowd",voucher_crowd)
      // console.log("params+++++++++++",params)
      // console.log("goods+++++++++++",goods)
      switch (voucher_crowd) {
        case 1:
          params.goods_id = goods[0]['goods_id']
          params.goods_name = goods[0]['goods_name']
          break
        case 3:
          params.voucher_user = voucher_user
          break
        case 4:
          params.goods_id = goods[0]['goods_id']
          params.goods_name = goods[0]['goods_name']
          break
        case 5:
          params.voucher_custom = voucher_custom
          break
        case 6:
          params.voucher_label = voucher_label
          break
      }
      voucherNumber(params).then(res => {
        const { data: { data: voucherNumber } } = res
        this.voucherNumber = `${voucherNumber}`
        console.log('666666666666666666666666', this.voucherNumber)
      })
    },
    findlabels() {
      labelList().then(res => {
        console.log('123', res)
        this.communityData = res.data.data
      })
    },
    userChange(userlist) {
      this.formFormatData.formData.voucher_user = userlist
      if (userlist.length > 0) {
        this.findVoucherNumber()
      }
    },
    voucherLabelChange() {
      console.log('123', 456)
      this.formFormatData.formData.voucher_custom.map(item => {
        if (item.type === 'user_labels' && item.value.length > 0) {
          this.findVoucherNumber()
        }
      })
    },
    addDiyList() {
      this.formFormatData.formData.voucher_custom.push({ type: '', value: '' })
    },
    deleteDiyList(index) {
      this.formFormatData.formData.voucher_custom.splice(index, 1)
      this.findVoucherNumber()
    },
    formFormatCallBack(data, type, response) {
      if (type === 'editForm') {
        const { data: { data: { voucher_user = [] } } } = response
        this.initChooseUser.initList = voucher_user
      }
    },
    saveForm() {
      // 保存到你要的那个form值里面
      if (this.formFormatData.formData.coupon.length === 0) {
        this.$message.error('请添加对应优惠券')
      } else {
        if (this.formFormatData.formData.voucher_crowd === 5) {
          let isError = false
          this.formFormatData.formData.voucher_custom.some(item => {
            const { type, value } = item
            if (type === '' || (value === '' && type !== 'is_member')) {
              isError = true
              return !0
            }
          })

          if (isError || this.formFormatData.formData.voucher_custom.length === 0) {
            this.$message.error('请完善自定义人群选项')
          } else {
            this.formFormatSubmit({ router: { type: 'replace', path: '/application/couponClient', code: 1 } })
          }
        } else {
          if ((this.formFormatData.formData.voucher_crowd === 4 || this.formFormatData.formData.voucher_crowd === 1) && this.formFormatData.formData.goods.length === 0) {
            this.$message.error('请添加对应商品')
          } else {
            if (this.formFormatData.formData.voucher_crowd === 3 && this.formFormatData.formData.voucher_user.length === 0) {
              this.$message.error('请添加对应用户')
            } else {
              this.formFormatSubmit({ router: { type: 'replace', path: '/application/couponClient', code: 1 } })
            }
          }
        }
      }
    },
    filtersChange(val) {
      this.currentRow = val.currentRow
      const displayData = val.displayData
      const result = []
      displayData.map(item => {
        result.push({ img: item.image[0]['file_path'], goods_id: item.goods_id, goods_name: item.goods_name })
      })
      this.formFormatData.formData.goods = [result[result.length - 1]]
      this.findVoucherNumber()
    },
    filtersCouponChange(arg) {
      const { displayData } = arg
      // this.couponCurrentRow = currentRow
      displayData.map(item => {
        var hasIndex = this.formFormatData.formData.coupon.findIndex(tableitem => { return `${tableitem.coupon_id}` === `${item.coupon_id}` })
        console.log(hasIndex, this.formFormatData.formData.coupon)
        if (hasIndex === -1 && this.formFormatData.formData.coupon.length < 5) {
          this.formFormatData.formData.coupon.push({ coupon_id: item.coupon_id, expire_type: item.expire_type, start_time: item.start_time, end_time: item.end_time, expire_day: item.expire_day, name: item.name, coupon_type: item.coupon_type, rule: item.rule, coupon_price: item.coupon_price, rule_min_money: item.rule_min_money, min: item.min, max: item.max, discount: item.discount, reduce_price: item.reduce_price })
        }
      })
    },
    goodsToogle() {
      const result = []
      this.formFormatData.formData.goods.forEach(item => {
        result.push(item.goods_id)
        console.log('itessssssssssssssss', item)
      })
      this.$refs.chooseGoods.currentRow = result
      this.$refs.chooseGoods.toggle()
      // console.log("this.$refs.chooseGoods.toggle()",this.$refs.chooseGoods.toggle())
      console.log(' this.formFormatData.formData.goods', this.formFormatData.formData.goods)
    },
    couponToogle() {
      // this.$refs.chooseCoupon.currentRow = this.couponCurrentRow
      this.$refs.chooseCoupon.toggle()
    },
    deleteTable() {
      this.formFormatData.formData.goods.splice(0, 3)
      this.currentRow.splice(0, 1)
      this.findVoucherNumber()
      console.log('555555555555555555555', this.formFormatData.formData.goods)
      // this.formFormatData.formData.goods.map(res =>{
      //   console.log("resdddd",res)
      // })
    },
    toggleSelection(scope) {
      this.formFormatData.formData.coupon.splice(scope.$index, 1)
      this.currentRow.splice(scope.$index, 1)
    }
  }
}
</script>

<style lang="scss" scoped>
.coupon-client-fixed {
    .goods-list-img {
        height: 80px;
        width: 80px;
        margin-right: 18px;
        margin-bottom: 10px;
    }

    .goods-list-img-delete {
        position: absolute;
        left: 65px;
        top: 2px;
        height: 20px;
        width: 20px;
        color: rgb(73, 80, 96);
        cursor: pointer;
        top: 0px;
    }

    .table-raido-header {
        background: #f2f2f2;
        padding: 10px;
        font-weight: 700;
        color: #909399;
    }

    .table-raido-body {
        padding: 10px;
        line-height: 24px;
        border-bottom: 1px solid rgb(235, 238, 245);
    }

    .table-left {
        width: 15%;
    }

    .table-mid {
        width: 34%;
        margin-right: 20px;
    }

    .table-right {
        width: 49%;
    }

    /deep/ .sortable-ghost {
        opacity: 0.8;
        color: #fff !important;
        background: #79bbff !important;
    }

    /deep/ .el-input-number .el-input__inner {
        text-align: left !important;
    }

    /deep/ .coupon-num-input .el-input,
    .el-input-number {
        width: 170px;
    }

    .logo {
        height: 40px;
        width: 40px;
        border-radius: 50%;
        vertical-align: middle;
        margin-right: 6px;
    }
}
</style>
